.x-treelist-item-leaf
	background: $dark
	color: #fff

.x-treelist-container
	background: $dark
	color: #fff

.x-treelist-row
	background: $dark
	color: #fff

.x-treelist-row-with-icon
	background: $dark
	color: #fff

.x-treelist-item-expandable
	background: $dark
	color: #fff

.x-treelist-item-wrap
	background: $dark
	color: #fff

.x-treelist-item-text
	background: $dark
	color: #fff

.x-treelist-item-icon
	background: $dark
	color: #fff

.x-treelist-row-over
	color: #ff0
	> * >
		.x-treelist-item-text
			color: $blurple
			transition: color .5s

		.x-treelist-item-icon
			color: $blurple
			transition: color .5s
			&.pve-itype-treelist-item-icon-cdrom
				content: ' '
				background: url('/pve2/images/dd_icon-cdblurp.png') no-repeat
				background-size: 16px 16px
				transition: background .5s
				height: 16px
				top: 50%

		.fa-ceph:before
			background-image: url('/pve2/images/dd_cephblurp.png')
			background-size: 14px 14px
			transition: background-image .5s

.x-treelist-item-selected > .x-treelist-row
	background-color: $darker

.x-treelist-item-selected > div > div
	> .pve-itype-treelist-item-icon-cdrom
		content: ' '
		background: url('/pve2/images/dd_icon-cdblurp.png') no-repeat
		background-size: 16px 16px
		transition: background .5s
		height: 16px
		top: 50%
	> .x-treelist-item-icon.fa.fa-ceph:before
		background-image: url('/pve2/images/dd_cephblurp.png')
		background-size: 14px 14px
		transition: background-image .5s

.x-treelist-item-selected > div > div > div
	color: $blurple
